/*
 * @Author: Setsuna
 * @Email: setsuna.xyz@qq.com
 * @FilePath: \src\pages\QuotaManage\StockCheck\QuatoDetail\AddMaterialModal.tsx
 * @Date: 2022-05-27 16:10:18
 * @LastEditTime: 2022-06-02 11:58:52
 */
import { http, IUdFormItem, UdFilter, UdTable } from '@/lib'
import { WrappedFormUtils } from 'antd/lib/form/Form'
import React, { Component } from 'react'
import apis from '@/apis/AboutQuota'

interface IState {
  conditions: IUdFormItem[]
  loading: false
  dataSource: Record<string, any>[]
  selectedRows: Record<string, any>[]
  selectedRowKeys: number[]
  page: number
  size: number
  total: number
}

export default class AddMaterialModal extends Component<any> {
  private filterForm: WrappedFormUtils = {} as WrappedFormUtils
  private columns = [
    {
      title: '序号',
      dataIndex: 'id',
      key: 'id',
      width: '50px',
      render: (text, reoled, index) => index + 1,
    },
    { title: '物料编号', dataIndex: 'prodBarcode', key: 'prodBarcode', minWidth: '140px' },
    { title: '物料名称', dataIndex: 'matName', key: 'matName', minWidth: '180px' },
  ]
  state: IState = {
    conditions: [{ id: 'matName', label: '物料编号/名称', initialValue: '' }],
    loading: false,
    dataSource: [],
    selectedRows: [],
    selectedRowKeys: [],
    page: 1,
    size: 10,
    total: 0,
  }

  componentDidMount() {
    this.getRecordTableData()
    this.props.getHandler && this.props.getHandler(() => this.state.selectedRows.map(item => item))
  }

  private handleSearch = (values: object) => {
    this.setState({ dataSource: [], page: 1, total: 0 }, () => {
      this.getRecordTableData()
    })
  }

  private resetFilterHandle = (form: WrappedFormUtils) => {
    this.setState({ dataSource: [], page: 1, total: 0 }, () => {
      this.getRecordTableData()
    })
  }

  private handleChangePage = pagination => {
    const { current: page, pageSize: size } = pagination
    this.setState({ page, size }, () => {
      this.getRecordTableData()
    })
  }

  private getRecordTableData = async () => {
    this.setState({ loading: true })
    let { page, size } = this.state
    let { inventoryBegineTime, inventoryEndTime, brandCode, dealerCode } = this.props
    try {
      let list: any = await http.post(apis.GetMaterialByName, {
        page: page,
        size: size,
        conditions: {
          ...this.filterForm.getFieldsValue(),
          brandCode,
          dealerCode,
          inventoryBegineTime,
          inventoryEndTime,
        },
      })
      const dataSource = list.data?.content
      this.setState({
        dataSource,
        total: list.data.totalElements,
        loading: false,
      })
    } catch (error) {
      this.setState({
        loading: false,
      })
    }
  }

  private onSelectChange = (selectedRowKeys: number[], selectedRows: any[]) => {
    this.setState({ selectedRowKeys, selectedRows })
  }

  private onSelectAll = (selected, selectedRows, changeRows) => {
    if (selected) {
      const { dataSource } = this.state
      this.setState({ selectedRows: dataSource, selectedRowKeys: dataSource.map(({ prodBarcode }) => prodBarcode) })
    } else {
      this.setState({ selectedRows: [], selectedRowKeys: [] })
    }
  }

  render() {
    let { loading, page, size, total, dataSource, selectedRowKeys } = this.state
    return (
      <>
        <UdFilter
          getForm={form => {
            this.filterForm = form
          }}
          items={this.state.conditions}
          onSearch={values => {
            this.handleSearch(values)
          }}
          loading={loading}
          resetAfter={this.resetFilterHandle}
        />
        <UdTable
          rowKey="prodBarcode"
          loading={loading}
          columns={this.columns}
          dataSource={dataSource}
          onChange={this.handleChangePage}
          rowSelection={{
            type: 'radio',
            selectedRowKeys: selectedRowKeys,
            onChange: this.onSelectChange,
            onSelectAll: this.onSelectAll,
          }}
          scroll={{ x: true }}
          pagination={{
            current: page,
            pageSize: size,
            total: total,
            showQuickJumper: true,
            showSizeChanger: true,
            pageSizeOptions: ['10', '20', '30', '40'],
            showTotal: (total, range) => `共${total}项，当前${range[0]}-${range[1]}项`,
          }}
        ></UdTable>
      </>
    )
  }
}
